<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
  <link rel="StyleSheet" href="../css/product.css" type="text/css"
        media="screen"/>
</head>
<body>
  <div th:replace="common/top"></div>
  <div id="Catalog">
    <div id="Cart">
     <!--
      <%--    我的喜欢--%>
      <%session.setAttribute("page", "cart");%>
      <%@ include file="../account/myFavorite.jsp" %>-->
      <div th:replace="account/myFavorite"></div>

      <br>
      <br>
      <h2>购物车</h2>
      <br>
      <br>
      <form action="updateCart" method="post">

        <table id="CPI" align="center" th:if="${session.cart?.numberOfItems > 0}" >

              <tr>
              <th></th>
              <th><b>商品</b></th>
              <th><b>商品编号</b></th>
              <th><b>商品门类编号</b></th>
              <th><b>详情</b></th>
              <th><b>是否有库存</b></th>
              <th><b>数量</b></th>
              <th><b>单价</b></th>
              <th><b>总价</b></th>
              <th>&nbsp;</th>
            </tr>




            <tr th:each="cartItem:${session.cartItems}">
              <td><input id="cart_pic_td" type="checkbox" name="" th:value="${cartItem.item.itemId}"></td>

              <td id="cart_pic_td"><img id="cart_pic" th:src="${cartItem.item.product.description}"/></td>
              <td>
                <a class="itemId" th:href="@{itemForm(itemId=${cartItem.item.itemId})}" th:text="${cartItem.item.itemId}"></a>


              </td>
              <td th:text="${cartItem.item.product.productId}">

              </td>

              <td th:text="${cartItem.item.product.name}+${cartItem.item.attribute1} ">

              </td>

              <td th:text="${cartItem.inStock}"></td>

              <td>
                <input type="text" class="quantity" onblur="updateCart()"
                       th:name="${cartItem.item.itemId}"
                       th:value="${cartItem.quantity}">
              </td>

              <td>
                <label class="cartItemsPrice" th:text="${cartItem.item.listPrice}"></label>
                <!--                                <fmt:formatNumber value="${cartItem.item.listPrice}" pattern="$#,##0.00"/>-->
              </td>

              <td class="total">
                <label class="cartItemsTotalPrice" th:text="${cartItem.total}" ></label>
                <!--                                <fmt:formatNumber value="${cartItem.total}" pattern="$#,##0.00"/>-->
              </td>

              <td>
                <a id="delete" th:href="@{removeCartItem(workingItemId=${cartItem.item.itemId})}"
                   class="Button">删除</a>
              </td>
            </tr>




          <tr>
            <td>
              总价
            </td>
            <td colspan="9"><label id="subtotal" th:text="${session.cart?.subTotal}"></label></td>

          </tr>
          <input type="submit" value="更新购物车">




  <!--                     这里两个if语句是对应两种情况，在刚进入页面时，numberofitems是空，在清空购物车后则是0，我也不知道为啥-->



      </table>

          <table id="CPI" align="center">
          <tr th:if="${session.cart?.numberOfItems == null }">
              <td colspan="10"><b>你的购物车是空的，去下单试试吧！</b></td>
          </tr>


          <tr th:if="${session.cart?.numberOfItems == 0}">
              <td colspan="10"><b>你的购物车是空的，去下单试试吧！</b></td>
          </tr>
          </table>

    </form>
    <script src="js/Cart.js"></script>
    <br>
    <br>



      <a th:if="${session.cart?.numberOfItems > 0}" href="/order/newOrder" class="Button">支付</a>


    <br>
    <br>
  </div>
    <div id="Separator"></div>
  </div>

    <div>
    <br th:if="${session.cart?.numberOfItems == null || session.cart?.numberOfItems == 0 || (session.account != null && session.account?.profile?.bannerOption)}">
    <br>
    <div>&ensp;&ensp;<b>你也许会喜欢:</b></div>
    <div th:replace="common/recommend"></div>

  <div th:replace="common/bottom"></div>

</body>
</html>